import React from 'react';
const Record = () => {
    let navigate = React.$router.useNavigate();
    const [Business, setBusiness] = React.useState(React.$cookie.load('User') ?? {})
    // 下拉刷新
    const PullRefreshDemo = () => {
        setList([])
        setPage(1)
        setFinished(false)
        return new Promise(resolve => {
            setTimeout(() => {
                React.$vant.Toast.info('刷新成功')
                resolve(true)
            }, 1000)
        })

    }
    const [finished, setFinished] = React.useState(false)
    const [page, setPage] = React.useState(1)
    const [list, setList] = React.useState([])
    const load = async () => {
        setFinished(true)
        getRecordData()
    }
    const getRecordData = async () => {
        let result = await React.$api.record({
            page: page,
            busid: Business.id
        })
        if (result) {
            if (result.code == 1) {
                var lists = [...list, ...result.data]
                setList(lists)
                setPage(page + 1)
                setTimeout(() => {
                    setFinished(false)
                }, 1000)
            } else {
                setFinished(true)
                React.$vant.Toast.info(result.msg)
                return false
            }
        }
    }
    return (
        <>
            <React.$vant.NavBar
                title="消费记录"
                leftText=""
                onClickLeft={() => navigate('/business/index')}
            />
            <React.$vant.PullRefresh onRefresh={() => PullRefreshDemo(true)} >
                {/* List 组件可以与 PullRefresh 组件结合使用，实现下拉刷新的效果 */}
                <React.$vant.List finished={finished} onLoad={load} offset={5} >
                    <React.$vant.Cell.Group>
 
                    {list.map(item => {
                        return (
                            <React.$vant.Cell key={item.id} title={item.content} label={item.createtime} />
                        )
                    })}
                    </React.$vant.Cell.Group>
                </React.$vant.List>
            </React.$vant.PullRefresh>
        </>
    )
}

export default Record;